<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        #box{
            width: 400px;
            height: 400px;
            /*background: rgb(0,0,0);*/
            background: #000;
        }

    </style>
</head>
<body>
    <div id="box"></div>
</body>
</html>
<script>
    function getColor(){
        var n = Math.floor(Math.random()*256);
        if(n<16){
            n = "0"+n.toString(16);
        }else{
            n = n.toString(16);
        }
        return n;
    }
    // alert(getC())  
        
    var box = document.getElementById('box');
        function changeBg(){
            // var r = Math.floor(Math.random()*256);
            // if(r<16){
            //     r = "0"+r.toString(16);
            // }else{
            //     r = r.toString(16);
            // }
            // var g = Math.floor(Math.random()*256);
            // if(g<16){
            //     g = "0"+g.toString(16);
            // }else{
            //     g = g.toString(16);
            // }
            // var b = Math.floor(Math.random()*256);
            // if(b<16){
            //     b = "0"+b.toString(16);
            // }else{
            //     b = b.toString(16);
            // }
            // alert("#"+r+g+b)
            var r = getColor();
            var g = getColor();
            var b = getColor();
            box.style.background = "#"+r+g+b;
            setTimeout(arguments.callee,1000);
        }
        window.onload = changeBg;
</script>